﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SignIn.aspx.cs" Inherits="GroundWater.SignIn" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>登录大沽河地下水监测系统</title>
    <script src="js/jquery-1.3.2-vsdoc.js" type="text/javascript" ></script>
    <script language="javascript" src="js/jquery.js" type="text/javascript"></script>
    <link media=all href="js/resources/_Common/Common.css" type=text/css rel=stylesheet />
<link media=all href="js/resources/_Loadding/Loadding.css" type=text/css rel=stylesheet />
<link media=all href="js/resources/_Panel/Panel.css" type=text/css rel=stylesheet />
<link media=all href="js/resources/_Button/Button.css" type=text/css rel=stylesheet />
<link media=all href="js/resources/_TextBox/TextBox.css" type=text/css rel=stylesheet />
 <style type="text/css">
.centerContainer
{
	text-align:center;
	min-width:560px;
}
.wrapper
{
	width:70%; 
	margin:0 auto; 
	text-align:left; 
}
    </style>
</head>
<body class="centerContainer">

<div class="wrapper" style=" text-align:center; margin-top:80px;"><img alt="" src="images/login_top.jpg" /></div>

<div class="wrapper">
    <table style="width: 80%;">
        <tr >
            <td  style=" padding-top:50px; padding-left:100px; padding-right:60px;">
                <img alt="" style="float:right" src="images/login_left.gif" />
            </td>
            <td  style="padding-top:50px; padding-left:20px;">
                <form id="form2" runat="server"><asp:ScriptManager ID="scriptManager" runat="server" />
<!-- 面板内容 -->                
<div id="bodyPanel">
<div class="x-pne" id="panel" style="Z-INDEX: 9999; WIDTH: 260px;">
    <div class="corner-bg x-pne-lt x-pne-left" unselectable="on">
    <div class="corner-bg x-pne-rt x-pne-right">
    <div class="corner-bg x-pne-t">

    <div class="x-pne-caption font">登录</div>
    </div>
    </div>
    </div>
    
    <div>
    <div class="side-bg x-pne-l">
    <div class="side-bg x-pne-r">
    <div class="x-pne-c" style="WIDTH: 248px; HEIGHT: 124px">
    <div id="contentPanel"><!-- 控件实例 -->

    <div class=gbPanel>
        <table class=font>
        <tbody>
        <tr>
            <td>用户帐号:</td><td><input class="textField text-bg border-blur" id="txtUsername" type="text"  maxlength="16" /></td></tr>
        <tr>
            <td>口令:</td><td><input class="textField text-bg border-blur" id="txtPossword"  type="password" value="" maxlength="16" /></td>
        </tr>
        </tbody>
        </table>
    </div>

    <div class="gbPanel" style="margin-top:20px">
    <table class="method-area1">
    <tbody>
    <tr>
    <td style="padding-left:30px;">
        <div>
            <div class="btn-side btn-bg" style="background-position: 0% 0%"></div>
            <div class="btn-body btn-bg" style="background-position: 0px 168px; WIDTH: 60px"><button id="btnLogIn" name="btnLogIn" class="font" type="button">登   录</button></div>
            <div class="btn-side btn-bg" style="background-position: 0px 189px"></div>
        </div>
    </td>
    <td style="padding-left:30px;">
        <div>
            <div class="btn-side btn-bg" style="background-position: 0% 0%"></div>
            <div class="btn-body btn-bg" style="background-position: 0px 168px; WIDTH: 60px"><input class="font" type="reset" value="清   除" /></div>
            <div class="btn-side btn-bg" style="background-position: 0px 189px"></div>
        </div>
    </td>
    </tr>

    </tbody>
    </table>
    </div>


    </div>
    </div>
    </div>
    </div>
    <div class="corner-bg x-pne-lb x-pne-left">
        <div class="corner-bg x-pne-rb x-pne-right">
            <div class="corner-bg x-pne-b"></div>
        </div>
    </div>
    </div>
</div>
</div>
<!-- 面板内容结束 -->

<div>
<asp:updateprogress id="updateProgress" runat="server" DynamicLayout="true" DisplayAfter="100" >
    <progresstemplate>
        <div id="progressBackgroundFilter" ></div>
        <div id="processMessage">正在处理数据，请稍等...<br /><br /><img alt="Loading" src="images/loading_16.gif" /></div>
    </progresstemplate>
</asp:updateprogress>
</div>
                </form>
            </td>
            <td style="padding-left:0px; padding-right:100px;">
                &nbsp;
            </td>
        </tr>
        <tr>
        <td></td><td></td><td><img style="padding-left:60px; padding-right:100px;" alt=""  src="images/login_right.gif" /></td>
        </tr>
    </table>
</div>
<script type="text/javascript">
    //<![CDATA[
    jQuery(document).ready(function() {

        jQuery.each(jQuery("button", jQuery(".method-area1")), function() {
            jQuery(this).bind("mousemove", function() {
                var center = this.parentNode;
                center.previousSibling.style.backgroundPosition = "0px 147px";
                center.style.backgroundPosition = "0px 105px";
                center.nextSibling.style.backgroundPosition = "0px 126px";
            });
            jQuery(this).bind("mouseout", function() {
                var center = this.parentNode;
                center.previousSibling.style.backgroundPosition = "";
                center.style.backgroundPosition = "0px 168px";
                center.nextSibling.style.backgroundPosition = "0px 189px";
            });

        }, null);

        //jQuery("#btnLogIn").click(submitForm);
        document.getElementById("btnLogIn").onclick = submitForm;

        jQuery("#updateProgress").ajaxStart(function() {
            jQuery("#updateProgress").show(1000);
            //window.setTimeout(function() { jQuery("#updateProgress").show(); }, 500);
            //jQuery("#updateProgress").css("position", "absolute").css("top", "60%");
        }).ajaxStop(function() {
            jQuery(this).hide();
        }).ajaxError(function(event, request, settings) {
            alert("出现了错误！没有链接到数据库。");
        });
    });

    var stop = false;

    function submitForm() {
        var username = $("#txtUsername").val();
        var password = $("#txtPossword").val();
        if (username == null || username.length == 0) {
            alert("用户帐号必须填写！");
            return;
        }
        if (password == null || password.length == 0) {
            alert("密码必须填写！");
            return;
        }
        $.post(
                    "AllowAccess/LoginHandler.ashx",
                    { "username": username, "password": password },
                    function(data) {
                        var response = data;
                        //alert(data);
                        //window.location = 'Default.aspx';
                        if (data && data != "0") {
                            window.location = 'Default.aspx';
                        }
                        else {
                            
                            alert("用户帐号或密码不正确。");
                            
                        }
                    },
                    "text");
    }
    
    

    function pageLoad(sender, args) {
        $get("txtUsername").focus();
    }

    $addHandler($get("txtUsername"), "keydown", tabHandler);
    $addHandler($get("txtPossword"), "keydown", submitHandler);

    function tabHandler(e) {
        if (e.keyCode == Sys.UI.Key.enter) {
            $get('txtPossword').focus();
        }
    }

    function submitHandler(e) {
        if (e.keyCode == Sys.UI.Key.enter) {
            submitForm();
        }
    }
    //]]>
</script>
</body>
</html>
